<template>
  <div class="headName" style="display:inline-flex; color: white; ">
    <h2>{{ netName }}</h2>
  </div>
  <div class="toolbar" style="float: right;">    
    <el-dropdown>
      <el-icon color="#fafafa" style="margin-right: 8px; margin-top: 1px" size="large">
        <UserFilled />
      </el-icon>
      <!-- <el-icon style="margin-right: 8px; margin-top: 1px"><setting/></el-icon> -->
      <template #dropdown>
        <el-dropdown-menu>
          <el-dropdown-item @click="toPersonal">个人信息</el-dropdown-item>
          <el-dropdown-item @click="tom">退出登陆</el-dropdown-item>
        </el-dropdown-menu>
      </template>
    </el-dropdown>
    <span style="color: white;">{{visitor.name}}</span>
  </div>
</template>
<script  setup>
import { ref, onBeforeMount } from 'vue'
import { Menu as UserFilled } from '@element-plus/icons-vue'
import { useRouter, useRoute } from 'vue-router'
import requests from '@/api/ajax'


const route = useRoute();

// onBeforeMount(() => {
//   // const id = $router.params.practicalId
//   // if(id === 1)
//   // {
//   //     alert('成功')
//   // }
//   const Id = route.query.id
//   if (Id === '1') {
//     const asd = requests({ url: "/students/detil", method: "get", }).then(res => {
//       //将名字存在myInfo
//       const abc = res.rdata
//       myInfo.value = abc.stuName
//     })
//       .catch(err => {
//         console.error(err.data);
//         // 登录请求失败后的操作
//       });
//   } else if (Id === '2') {
//     console.log(123);
//     const asd = requests({ url: "/inner/myDetil", method: "get", }).then(res => {
//       //将名字存在myInfo
//       const abc = res.rdata
//       myInfo.value = abc.teacherName

//     })
//       .catch(err => {
//         console.error(err.data);
//         // 登录请求失败后的操作
//       });
//   }
// })

//获取登陆者的信息
let visitor = JSON.parse(localStorage.getItem("visitor"));


const router_useRouter = useRouter()
let netName = "校企合作模式下的实践管理系统"


const myInfo = ref({

})


//退出登录
function tom() {
  localStorage.removeItem('user');
  localStorage.removeItem('visitor');
  router_useRouter.push({ path: '/login' })
}

//到个人详情页面
function toPersonal() {
  router_useRouter.push({ path: 'personal' })
}

//到更改密码
function changePwd() {
  router_useRouter.push({ path: 'password' })
}

</script>

<style scoped>
/* .el-header {
  position: relative;
  background-color:  #283593;
  color: var(--el-text-color-primary);
} */
.layout-container-demo .toolbar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  right: 20px;
}
</style>
